const path = require('path');
const webpack = require('webpack');
const CopyPlugin = require('copy-webpack-plugin');
const TerserPlugin = require("terser-webpack-plugin")
// 引入打包时清除 dist 目录的插件,引入时需要用对象{ CleanWebpackPlugin }包裹起来
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const htmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const {VueLoaderPlugin} = require('vue-loader');
const isProduction = process.env.NODE_ENV == 'production'
process.env.BASE_URL = '/sheet-front/'
module.exports = {
  mode: 'development',
  optimization: {
    minimize: true,
    minimizer: [new TerserPlugin({
      extractComments: false, //不将注释提取到单独的文件中
    })],
  },
  entry: {
    index: "./src/index.js",
    sheet: "./src/sheet.js",
    list: "./src/list.js",
  },
  output: {
    publicPath: "/sheet-front/",
    filename: "[name].[hash:8].js",
    path: path.join(__dirname, "dist")
  },
  devServer: {
    static: [
      {
        directory: path.join(__dirname, 'public/js'),
        publicPath: "/sheet-front/js",
      }, {
        directory: path.join(__dirname, 'public/css'),
        publicPath: "/sheet-front/css",
      },
    ]


  },
  resolve: {
    alias: {
      '@': "/src"
    }
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            cacheDirectory: true,
            cacheCompression: false,
          }
        }
      },
      {
        test: /\.vue$/,
        loader: 'vue-loader'
      },
      {
        test: /\.less$/,
        use: [
          'vue-style-loader',
          'css-loader',
          'less-loader'
        ]
      },
      {
        test: /\.css$/,
        oneOf: [
          // 这里匹配 `<style module>`
          {
            resourceQuery: /module/,
            use: [
              'vue-style-loader',
              {
                loader: 'css-loader',
                options: {
                  modules: true,
                  localIdentName: '[local]_[hash:base64:5]'
                }
              }
            ]
          },
          // 这里匹配普通的 `<style>` 或 `<style scoped>`
          {
            use: [
              'vue-style-loader',
              'css-loader'
            ]
          }
        ]
      },
    ]
  },
  plugins: [
    new VueLoaderPlugin(),
    new CleanWebpackPlugin(),
    new htmlWebpackPlugin({
      template: "./public/index.html",
      filename: 'index.html',
      title: "答题卡",
      chunks: ['index'] // 只引用 index.js

    }),
    new htmlWebpackPlugin({
      template: "./public/sheet.html",
      filename: 'sheet.html',
      title: "答题卡",
      chunks: ['sheet'] // 只引用 sheet.js

    }),
    new htmlWebpackPlugin({
      template: "./public/list.html",
      filename: 'list.html',
      title: "答题卡",
      chunks: ['list'] // 只引用 list

    }),
    new webpack.HotModuleReplacementPlugin(),
    new CopyPlugin(
      {
        patterns: [
          {
            from: 'public',
            to: '',
            toType: 'dir',
            noErrorOnMissing: true,
            globOptions: {
              ignore: [
                '**/.DS_Store',
                '**/*.html'
              ]
            },
            info: {
              minimized: true
            }
          }
        ]
      }
    ),
  ]
};